Vue.component("rebatesend", {
  data() {
    return {
      tabledata: [],
      datebe: [],
      userlist: "",
      rtype: "",
      rbz: "",
      rebatetype: [],
      detaildata: [{"times":12}],
      detailVisible: false
    }
  },
  props: ["path", "col", "showitem", "pval", "vt"],
  template: `<div style="margin:20px;">
      <el-input type="textarea" :rows="2" placeholder="请输入返利用户的usrid一行一个" v-model="userlist"></el-input>
      <el-select v-model="rtype" clearable placeholder="请选择返利类型">
        <el-option v-for="item in rebatetype" :key="item.tid" :label="item.typename" :value="item.tid">
        </el-option>
      </el-select>
      <el-input placeholder="请输入备注" v-model="rbz"></el-input>
      <el-button type="primary" plain @click="send()">发放返利</el-button><br/><br/>
      <el-date-picker v-model="datebe" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd""></el-date-picker>
      <el-button type="primary" plain @click="opendata()">查询</el-button>
      <el-table :data="tabledata" style="width: 100%">
        <el-table-column v-for="(item,index) in col" :prop="index" :label="item"></el-table-column>
        <el-table-column fixed="right" label="操作" width="100">
          <template slot-scope="scope">
            <el-button @click="showdetail(scope.row)" type="text" size="small">详细</el-button>
          </template>
        </el-table-column>
      </el-table>

      <el-dialog title="返利明细" :visible.sync="detailVisible" width="40%">
        <el-table :data="detaildata" style="width: 100%">
          <el-table-column prop="times" label="日期"></el-table-column>
          <el-table-column prop="usrid" label="游戏ID"></el-table-column>
          <el-table-column prop="nickname" label="昵称"></el-table-column>
          <el-table-column prop="typename" label="返利类型名字"></el-table-column>
          <el-table-column prop="score" label="金币数"></el-table-column>
          <el-table-column prop="BZ" label="备注"></el-table-column>
        </el-table>
      </el-dialog>
    </div>`,
  methods: {
    opendata: function() { //请求数据
      let $this = this;
      http.get("/ajax/" + this.path + "?B=" + (this.datebe[0] || "") + "&E=" + (this.datebe[1] || "")).then(function(res) {
          $this.tabledata = res.data;
      });
    },
    send: function(){ //奖励发放
      if(this.userlist.length < 4) return this.$message("必须输入游戏id");
      if(!this.rtype) return this.$message("必须选择返利类型");
      let $this = this;
      console.log(this.userlist);
      http.get("/ajax/" + this.path + "?U=" + encodeURI(this.userlist) + "&tid=" + this.rtype + "&bz=" + this.rbz).then(function(res) {
        $this.$message({message: res.data.m, showClose: true, duration: 0, dangerouslyUseHTMLString: true});
      });
    },
    showdetail: function(row){ //显示奖励明细
      this.detaildata = [];
      this.detailVisible = true;
      let $this = this;
      http.get("/ajax/" + this.path + "?T=" + row.tid + "&B=" + row.dt).then(function(res) {
        $this.detaildata = res.data;
      });
    }
  },
  created: function () {
    console.log("created ", this.path);
    this.opendata();

    let $this = this;
    http.get("/ajax/rebatetype?M=1").then(function(res) {
      $this.rebatetype = res.data;
    });
  }
});